<!DOCTYPE html>
<html>
<head>
    <!-- <meta charset="UTF-8"> -->
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <@mup.header/>
    <script>
        window.contextPath = '${gatewayPath}';
        window.contextLocale = '${request.getLocale()}';
        window.__maxInactiveInterval = ${maxInactiveInterval!'3600'};
        window.apiDesigner = ${apiDesigner!'false'};
        window.serviceId = '${id!'-1'}';
        window.serviceAlias = '${describe}';
        window.releaseStrategy = '${releaseStrategy}';
        window.themeId = '${themeId}';
        window.flagChengGuo ='${flagChengGuo}';
        window.row = {"id":"${id}", "flowid":"-1", name: "${name}",serviceAlias: "${describe}", ignore: true, type: '${type}',
            releaseStrategy:'${releaseStrategy}' ,launchState:'${launchState}',serviceAddr:'${serviceAddr}',
            publishType:'${publishType}',serviceValue1:'${serviceValue1}',serviceValue2:'${serviceValue2}',selectValue:'${selectValue}',
            service1Id:'${service1Id}',service2Id:'${service2Id}',status:'${status}',workSpaceId:'${workSpaceId}',service1Name:'${service1Name}',service2Name:'${service2Name}'};
        window.urlPrefix = '${urlPrefix}';
        window.resPar = ${resPar};
        window.authCodes = [
            <#list tokens as tk>
            {key:"${tk.key}",secret:"${tk.secret}",name:"${tk.name}"} ,
            </#list>
        ];
    </script>
    <!--引入微服务平台的样式-->
    <@mup.link  href="/mine/vue2.6/css/index.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link  href="/mine/vue2.6/css/tempo.css?v=2023-04-24T10:54:57Z" model="all"/>

    <@mup.link href="/css/layout-default.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/icon.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/jsPlumb/jsPlumbToolkit-defaults-2.2.4.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/ui.jqgrid.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/leaflet/leaflet.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/leaflet/leaflet.marker.highlight.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/jquery.treeTable.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/zTreeStyle.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/plugin/plugin.yui.min.css?v=2023-04-24T10:54:57Z" model="product"/>
    <@mup.link href="/css/tempo.jquery-ui.theme.[theme].css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/plugin/theme/tempo-plugin.theme.[theme].css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/script/config/css/style.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/plugin/tempo-validator.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/css/plugin/tempo-validatebox.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/css/plugin/tempo-tempoprogressbar.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/plugin/tempo-partprogressbar.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/css/plugin/tempo-selectmenu.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/css/plugin/tempo-button.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/css/plugin/tempo-dialog.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/css/plugin/tempo-datagrid.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/css/plugin/tempo-alert.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/mine/css/tempo-columnselect.css?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.link href="/ai_runtime/css/app-publish.css?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.link href="/css/timepicker/jquery-ui-timepicker-addon.min.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/css/popover/jquery.webui-popover.min.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/ai_runtime/css/app-configuration-gray.css?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.link href="/css/plugin/tempo-tabs.css?v=2023-04-24T10:54:57Z"/>
    <@mup.link href="/ai_runtime/css/creat-gray.css?v=2023-04-24T10:54:57Z" model="all"/>
    <!--引入vue-->
    <@mup.script src="/mine/vue2.6/js/vue-2.6.14.js?v=2023-04-24T10:54:57Z" model="all"/>
    <!--引入http-vue-loader-->
    <@mup.script src="/mine/vue2.6/js/http-vue-loader-1.4.2.js?v=2023-04-24T10:54:57Z" model="all" />
    <!--引入elemenui组件库-->
    <@mup.script src="/mine/vue2.6/js/element-ui@2.15.2.js?v=2023-04-24T10:54:57Z" model="all"/>

    <@mup.script src="/js/dateUtils.js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/js/tempo-compare-utils.js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/js/jquery-validate.min.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/tempo-utils.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/des-utils.yui.min.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/regexUtil.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/jquery.form.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/jquery.jqGrid.min.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/jquery.layout.yui.min.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/jqgrid/i18n/grid.locale-[locale].js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/plugin/i18n/tempo-plugin-[locale].js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/js/plugin/plugin.yui.min.js?v=2023-04-24T10:54:57Z" model="product"/>
    <@mup.script src="/js/plugin/tempo-plugin-utils.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-module.js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/js/plugin/tempo-validator.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-validatebox.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-numberbox.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-tempoprogressbar.js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/js/plugin/tempo-partprogressbar.js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/js/plugin/tempo-dialog.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-datagrid.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-alert.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-confirm.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-button.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-radio.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-checkbox.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/plugin/tempo-selectmenu.js?v=2023-04-24T10:54:57Z"/>
    <@mup.script src="/js/tempo-constant.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/mine/plugins/selectpicker/js/selectpick.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/mine/js/mine-util.js?v=2023-04-24T10:54:57Z"  model="all"/>
    <@mup.script src="/js/plugin/tempo-tabs.js?v=2023-04-24T10:54:57Z"/>
    <script>
        (function(){
            var i18ns = ${i18ndict!'{}'};
            for ( var i in i18ns) {
                TempoUtils.locale(i, i18ns[i]);
            };
        })();

    </script>
    <@mup.script src="/js/jsPlumb/jsPlumb-2.2.4.js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/mine/js/mine-constants.js?v=2023-04-24T10:54:57Z" model="all"/>
    <@mup.script src="/mine/publish/js/mine-publish-config-service.js?v=2023-04-24T10:54:57Z" model="all"/>
    <mscript src="${gatewayPath}/ai_runtime/js/gray-configuration-mutual.js?v=2023-04-24T10:54:57Z"/>
    <mscript src="${gatewayPath}/mine/publish/js/service-test-mutual.js?v=2023-04-24T10:54:57Z"/>
    <mscript src="/mine/publish/js/script.js?v=2023-04-24T10:54:57Z" />

</head>
<body>
<div class='gray-config-container ui-layout-center' id="gray-config-container">
    <div style="width: 100%; height: 100%">
        <!--top-->
        <div  class="gray-config-container-top" id="${id}">
            <!--点击启动-->
            <a href="javascript:;void(0)" onclick="return false;" class='gray-config-button start-button' style="width: 72px;"></a>
            <!--点击测试服务-->
            <a href="javascript:;void(0)" onclick="return false;" class='gray-config-button test-button' style="width: 115px;"><@spring.message "aiview.do-test"/></a>
            <!--点击下载-->
            <span id="gray-config-download" v-if="type != 'stream'">

					</span>
        </div>
        <!--body-->
        <div class="gray-config-container-body">
            <div class="gray-config-container-left">
                <!--服务信息-->
                <div class="service-info" sign="block" id="service-info">
                    <div class="gray-container-left-block-top">
                        <!--服务信息title-->
                        <span class="app-container-left-head-title"><@spring.message "mine.fuwuxinxi"/></span>
                        <!--编辑按钮-->
                        <span class="app-container-left-head-btngroups">
								<span class="ui-icon tempo-ui-icon tempo-ui-icon-rename"></span>
								<span><@spring.message "mine.publish-btn-edit"/></span>
                        </span>
                    </div>
                    <div id="gray-service-config" style="padding-left: 43px;padding-top: 12px;">
                        <el-form
                                style="background-color:#ffffff;border-color:#ffffff"
                                ref="grayConfigRef"
                                :model="grayConfigForm"
                                :rules="grayConfigRule"
                                label-width="100px"
                                label-position="right">
                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "aiview.app_name"/>" prop="name" >
                                        <el-input
                                                :disabled="!isEdit"
                                                maxlength="60"
                                                v-model.trim="grayConfigForm.name"
                                                placeholder="<@spring.message "aiview.input_service_name"/>"
                                                clearable></el-input>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "aiview.service_alias"/>" prop="describe" >

                                        <el-input
                                                v-if="isEdit"
                                                maxlength="60"
                                                :disabled="!isEdit"
                                                v-model.trim="grayConfigForm.describe"
                                                clearable></el-input>
                                        <span style="font-size: 12px !important;" v-if="!isEdit && grayConfigForm.describe==''"><@spring.message "aiview.alias"/></span>
                                        <span style="font-size: 12px !important;" v-if="!isEdit && grayConfigForm.describe!=''">${describe}</span>
                                        <span style="position: absolute;font-size: 12px" @click='loadAlias(grayConfigForm.describe)' v-if="!isEdit && grayConfigForm.describe!=''"><@spring.message "aiview.djfz"/></span>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "aiview.syncService1"/>" prop="serviceName1">
                                        <el-cascader
                                                :disabled="!isEdit"
                                                @change="getSameMessage1(grayConfigForm.serviceName1)"
                                                :options="syncFlowOptions"
                                                :props="syncFlowProps"
                                                v-model.trim="grayConfigForm.serviceName1"></el-cascader>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "aiview.syncService2"/>"  prop="serviceName2">
                                        <el-cascader
                                                clearable
                                                :disabled="!isEdit"
                                                @change="getSameMessage2(grayConfigForm.serviceName2)"
                                                :options="syncFlowOptions"
                                                :props="syncFlowProps"
                                                v-model.trim="grayConfigForm.serviceName2"></el-cascader>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="20">
                                <el-form-item label="<@spring.message "aiview.publishType"/>" prop="publishType">
                                    <el-input
                                            :disabled="true"
                                            v-if="!isEdit"
                                            v-model.trim="releaseStrategy"
                                            clearable></el-input>
                                    <div v-else>
                                        <el-select :style="{ width: '100px' }" v-model="grayConfigForm.publishType">
                                            <el-option label="<@spring.message "aiview.flow_segmentation"/>" value="0"></el-option>
                                            <el-option label="<@spring.message "aiview.the_specified_service"/>" value="1"></el-option>
                                        </el-select>
                                        <template v-if="grayConfigForm.publishType==0">
                                            <span><@spring.message "aiview.syncService1"/></span>
                                            <el-input
                                                    @change="handleChange1"
                                                    oninput="value=value.replace(/[^\d]/g,'')"
                                                    :style="{ width: '60px'}"
                                                    v-model="grayConfigForm.serviceValue1"></el-input>
                                            <span><@spring.message "aiview.syncService2"/></span>
                                            <el-input
                                                    @change="handleChange2"
                                                    oninput="value=value.replace(/[^\d]/g,'')"
                                                    :style="{ width: '60px'}"
                                                    v-model="grayConfigForm.serviceValue2"></el-input>
                                        </template>
                                        <template v-if="grayConfigForm.publishType==1">
                                            <el-radio  v-model="grayConfigForm.selectValue" label="0"><@spring.message "aiview.syncService1"/></el-radio>
                                            <el-radio  v-model="grayConfigForm.selectValue" label="1"><@spring.message "aiview.syncService2"/></el-radio>
                                        </template>
                                    </div>
                                </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-cow :span="10">
                                    <el-form-item label="<@spring.message "aiview.service_alias"/>">
                                        <span style="font-size: 12px !important">${urlPrefix}</span>
                                    </el-form-item>
                                </el-cow>
                                <el-cow :span="10">
                                    <el-form-item label="<@spring.message "aiview.service_alias"/>" prop="serviceAddr" label-width="0px">
                                        <el-input
                                                maxlength="60"
                                                :disabled="!isEdit"
                                                v-model.trim="grayConfigForm.serviceAddr"
                                                placeholder="<@spring.message "aiview.input_service_alias"/>"
                                                clearable>
                                        </el-input>
                                    </el-form-item>
                                </el-cow>
                            </el-row>

                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "mine.qqfs"/>">
                                        <span style="font-size: 12px !important">RESTful</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "mine.qqff"/>">
                                        <span style="font-size: 12px !important">POST</span>
                                    </el-form-item>
                                </el-col>
                            </el-row>

                            <el-row>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "mine.qqgs"/>">
                                        <span style="font-size: 12px !important">JSON</span>
                                    </el-form-item>
                                </el-col>
                                <el-col :span="10">
                                    <el-form-item label="<@spring.message "mine.ffgs"/>">
                                        <span style="font-size: 12px !important">JSON</span>
                                    </el-form-item>
                                </el-col>
                            </el-row>
                        </el-form>
                    </div>
                </div>

                <div class="license-info-gray gray-container-left-block" sign="block" id="license-info-gray">
                    <div class="gray-container-left-block-top">
                        <!--服务信息title-->
                        <span class="app-container-left-head-title"><@spring.message "mine.sqxx"/></span>
                        <i id="gray-sqxx" class="el-icon-warning-outline"></i>
                    </div>
                    <div class="app-config-license-info-form">
                        <table id="license-info-table"></table>
                    </div>
                </div>

                <div class="flowparam-info gray-container-left-block" sign="block" id="flowparam-info-gray">
                    <div class="gray-container-left-block-top">
                        <!--服务信息title-->
                        <span class="app-container-left-head-title"><@spring.message "mine.liuchengcanshu"/></span>
                        <i id="gray-lccs" class="el-icon-warning-outline"></i>
                    </div>
                    <div class="app-config-flowparam-info-form">
                        <table id="gray-flowparam-info-table"></table>
                    </div>
                </div>
                <div class="request-info-gray gray-container-left-block" sign="block" id="request-info-gray">
                    <div class="gray-container-left-block-top">
                        <!--服务信息title-->
                        <span class="app-container-left-head-title"><@spring.message "mine.qqcanshusm"/></span>
                    </div>
                    <div class="app-config-request-info-form">
                        <table id="requests-info-table-gray"></table>
                    </div>
                </div>
                <div class="response-info-gray gray-container-left-block" sign="block" id="response-info-gray">
                    <div class="gray-container-left-block-top">
                        <!--服务信息title-->
                        <span class="app-container-left-head-title"><@spring.message "mine.fhcanshusm"/></span>
                    </div>
                    <div class="app-config-response-info-form">
                        <table id="response-info-table-gray"></table>
                    </div>
                </div>
            </div>

            <div class="gray-config-container-right">
                <div class="app-config-right-ul-groups">
                    <ul class="app-config-right-ul">
                        <li class="navItems"><a href="javascript:;void(0)" navTo="#service-info" class="navItems"><@spring.message "mine.fuwuxinxi"/></a></li>
                        <li class="navItems"><a href="javascript:;void(0)" navTo="#license-info-gray" class="navItems"><@spring.message "mine.sqxx"/></a></li>
                        <li class="navItems"><a href="javascript:;void(0)" navTo="#flowparam-info-gray" class="navItems"><@spring.message "mine.request_flowparams"/></a></li>
                        <li class="navItems"><a href="javascript:;void(0)" navTo="#request-info-gray" class="navItems"><@spring.message "mine.qqcanshusm"/></a></li>
                        <li class="navItems"><a href="javascript:;void(0)" navTo="#response-info-gray" class="navItems"><@spring.message "mine.fhcanshusm"/></a></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<@mup.link href="/mine/css/mine.theme.[theme].css?v=2023-04-24T10:54:57Z"  model="all"/>
</body>
</html>